import styles from './index.module.less'
import cm from 'classnames'
import { useSetState } from 'ahooks'
import Input from '@/components/input'
import Button from '@/components/button'
import { passApply, getApplyNumber } from '@/api/admin'
import Toast from '@/components/toast'
import { applyNumber } from '@/store'
import { useSetRecoilState } from 'recoil'

const Index = (props) => {
  const setApplyNumber = useSetRecoilState(applyNumber)
  const [forInfo, setFormInfo] = useSetState({
    ratio: 30,
  })
  const { className, close, id, refresh } = props
  const submit = async () => {
    const res = await passApply({ ...forInfo, id })
    if (!res.code) {
      Toast.normal('操作成功')
      close()
      refresh()
      const res = await getApplyNumber()
      setApplyNumber(res.data.total || 0)
    } else {
      Toast.normal(res.msg)
    }
  }
  return (
    <div className={cm(styles.panel, className)}>
      <img src="/images/close.webp" className={styles.close} onClick={close} />
      <div className={styles.label}>
        <span className={styles.need}>*</span>
        <span className={styles.text}>分成比例：</span>
        {/* <span className={styles.err}>分成比例不在限制区域内</span> */}
      </div>
      <Input className={styles.rate} disabled placeholder="30%" />
      <div className={styles.label}>
        <span className={styles.text}>备注：</span>
      </div>
      <Input
        inputClass="input"
        textarea
        className={styles.remark}
        placeholder="备注信息"
        onChange={(e) => setFormInfo({ remark: e.currentTarget.value })}
      />
      <Button className={styles.btn} onClick={submit}>
        确认通过
      </Button>
    </div>
  )
}

export default Index
